<template>
    <div class="LiveListContent">
        <ul>
            <li class="pic" v-for="item in 6">
                <van-image
                width="100%"
                height="100%"
                fit="cover"
                src="https://img.pddpic.com/goods/images/2020-10-14/ecb9b393-291e-488a-aed7-b37de583b487.jpeg?imageMogr2/thumbnail/!344x516r%7CimageView2/1/w/344/h/516%7CimageView2/2/w/344/q/70/format/webp"/>

                <p class="icon-online">
                    <van-image
                            width="100%"
                            height="100"
                            fit="cover"
                            src="https://commimg.pddpic.com/mms_static/2020-01-16/0c0d8168-b69c-4a18-adfe-342caf303225.gif?imageView2/2/w/1300/q/70"

                    />
                    <span>{{15441514|numFormat}}</span>
                </p>


                <p class="title">
                    <span>家纺直播精选好物，大促提前购</span>
                </p>
            </li>

        </ul>
    </div>
</template>

<script>
    import mixins from "../common/mixins";

    export default {
        name: "LiveListConent",
        mixins:[mixins],
        props:["liveId"],
        created() {
            console.log(this.liveId)
        }
    }
</script>

<style lang="less" scoped>
    .LiveListContent{
        border-top: 1px solid #ddd;
       padding: 20px 20px 0;
        ul{
            display: flex;
            flex-wrap: wrap;
            justify-content: space-between;
        }
        .pic {
            width: 344px;
            height: 515px;
            position: relative;
            margin-bottom:15px ;

            .icon-online {
                position: absolute;
                top: 0;
                font-size: 22px;
                .van-image {
                    width: 116px !important;
                    height: 32px !important;
                    vertical-align: middle;
                }
                span{
                    color: #dddddd;
                }
            }
            .title{
                position: absolute;
                bottom: 5px;
                left: 3px;
                font-size: 28px;
                color:  #dddddd;
                font-weight: bold;
            }
        }
    }
</style>